// 前端性能优化配置
const path = require('path')
const webpack = require('webpack')

module.exports = {
  // 生产环境优化
  configureWebpack: {
    optimization: {
      splitChunks: {
        chunks: 'all',
        cacheGroups: {
          vendor: {
            name: 'chunk-vendors',
            test: /[\\/]node_modules[\\/]/,
            priority: 10,
            chunks: 'initial'
          },
          elementUI: {
            name: 'chunk-element-plus',
            test: /[\\/]node_modules[\\/]element-plus[\\/]/,
            priority: 20,
            chunks: 'all'
          },
          charts: {
            name: 'chunk-charts',
            test: /[\\/]node_modules[\\/]chart\.js[\\/]/,
            priority: 20,
            chunks: 'all'
          }
        }
      }
    },
    plugins: [
      // 预加载关键资源
      new webpack.PrefetchPlugin('element-plus'),
      new webpack.PrefetchPlugin('chart.js'),
      
      // 压缩优化
      new webpack.optimize.ModuleConcatenationPlugin()
    ]
  },

  // 开发环境优化
  devServer: {
    // 启用gzip压缩
    compress: true,
    
    // 热更新优化
    hot: true,
    
    // 代理配置优化
    proxy: {
      '/api': {
        target: 'http://localhost:9090',
        changeOrigin: true,
        ws: true,
        timeout: 10000
      }
    }
  },

  // 构建优化
  chainWebpack: config => {
    // 生产环境优化
    if (process.env.NODE_ENV === 'production') {
      // 移除console.log
      config.optimization.minimizer('terser').tap(args => {
        args[0].terserOptions.compress.drop_console = true
        return args
      })

      // 图片压缩
      config.module
        .rule('images')
        .test(/\.(gif|png|jpe?g|svg)$/i)
        .use('image-webpack-loader')
        .loader('image-webpack-loader')
        .options({
          mozjpeg: { progressive: true, quality: 80 },
          optipng: { enabled: false },
          pngquant: { quality: [0.65, 0.90], speed: 4 },
          gifsicle: { interlaced: false },
          webp: { quality: 80 }
        })

      // 预加载关键路由
      config.plugin('preload').tap(options => {
        options[0].rel = 'preload'
        options[0].include = 'initial'
        options[0].fileBlacklist = options[0].fileBlacklist || []
        options[0].fileBlacklist.push(/\.map$/, /hot-update\.js$/)
        return options
      })

      // 预获取非关键路由
      config.plugin('prefetch').tap(options => {
        options[0].rel = 'prefetch'
        return options
      })
    }

    // 别名配置
    config.resolve.alias
      .set('@', path.resolve(__dirname, 'src'))
      .set('@components', path.resolve(__dirname, 'src/components'))
      .set('@views', path.resolve(__dirname, 'src/views'))
      .set('@utils', path.resolve(__dirname, 'src/utils'))
      .set('@services', path.resolve(__dirname, 'src/services'))
  },

  // CSS优化
  css: {
    extract: process.env.NODE_ENV === 'production',
    sourceMap: false,
    loaderOptions: {
      sass: {
        additionalData: `@import "@/styles/variables.scss";`
      }
    }
  },

  // 性能优化
  performance: {
    hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
    maxEntrypointSize: 512000,
    maxAssetSize: 512000
  }
}
